<template>
    <div>
        <ol>
            <li v-for="problem in problems" :key="problem.id">
                 <div class="problem" @click="details(problem.id)">{{problem.title}}</div>
                <div class="additional">
                    <span class="pro">更新时间：{{problem.updateTime | timeFormater}}</span>
                <el-divider></el-divider>
            </div>
            </li>
        </ol>
    </div>
</template>

<script>
import {postRequest,getRequest} from '../utils/api.js'
export default {
    name: 'MyCollectProblem',

    data() {
        return {
           problems:[], 
        };
    },

    mounted() {
        getRequest('/user/collect/searchProblems').then((result) => {
            if(result){
                this.problems = result;
            }
        }).catch((err) => {
            
        });
    },

    methods: {
        details(id){            
            this.$bus.$emit('problemDetails',id);
        },
    },
};
</script>

<style  scoped>
.problem{
    font-size: 18px;
    line-height: 40px;
    font-weight: bold;
    cursor: pointer;
    letter-spacing:2px;
}
.additional{
    font-size: 12px;
    letter-spacing:1px;
}
.pro{
    margin-right: 28px;
    
}
</style>